<template>
  <div class="app-container">
    <el-form ref="formRef" :model="form" :rules="rules" label-width="0px">
      <el-row>
        <el-col :span="12">
          <el-form-item prop="content">
            <el-input
              v-model="form.content"
              type="textarea"
              placeholder="请输入廉政提醒标语（每句以分号分隔）"
              :autosize="{ minRows: 10, maxRows: 20 }"
            />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12" style="display: flex; justify-content: flex-end">
          <el-form-item>
            <el-button
              type="primary"
              @click="submitForm"
              v-hasPermi="['alarmBellRinging:add']"
              >保 存</el-button
            >
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script setup name="AlarmBellRinging">
import {
  getAlarmBellRing,
  addAlarmBellRing,
} from "@/api/other/alarmBellRinging";

const { proxy } = getCurrentInstance();
const loading = ref(true);

const data = reactive({
  form: {
    content: undefined,
  },
  rules: {
    content: [{ required: true, message: "内容不能为空", trigger: "blur" }],
  },
});

const { form, rules } = toRefs(data);

/** 查询警钟长鸣内容 */
function getList() {
  loading.value = true;
  getAlarmBellRing({}).then((response) => {
    const { data } = response;
    if (data) {
      form.value = data;
    }
    loading.value = false;
  });
}

/** 提交按钮 */
function submitForm() {
  proxy.$refs["formRef"].validate((valid) => {
    if (valid) {
      if (form.value.id != undefined) {
        addAlarmBellRing(form.value).then((response) => {
          proxy.$modal.msgSuccess("修改成功");
          open.value = false;
          getList();
        });
      } else {
        addAlarmBellRing(form.value).then((response) => {
          proxy.$modal.msgSuccess("新增成功");
          open.value = false;
          getList();
        });
      }
    }
  });
}

getList();
</script>
